<!DOCTYPE html>
<html>
<head>
	<title>Play Game</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="styles/jquery.mobile-1.3.1.min.css" />
	 <link rel="stylesheet" href="styles/gameByDesign.css" />
     <link rel="stylesheet" href="styles/quizStyle.css" />
   
	<script src="scripts/jquery-2.0.2.min.js"></script>
	<script src="scripts/jquery.mobile-1.3.1.min.js"></script>
	<script src="scripts/utils.js"></script>
	<script src="scripts/quiz_designer.js"></script>
	<script src="scripts/my_games.js"></script>
	
	<script src="scripts/slickQuiz-config.js"></script>
	<script src="scripts/slickQuiz.js"></script>
</head>

<body>

<div data-role="page" id="gamePlayPage">
<div id ="wrapper">

<!-- /header -->
		<h1><img src="images/logo.png" style="width:30%;" alt="logo"></h1>
        <h2>Let's Play!</h2>
        
	<div id="gameContainer">
	
    <div class="leftImage">
    
    <div id="questionBox">
    
    	
	<div id="slickQuiz">
        <p>Answer the following quiz by selecting the correct answer.</p>
        <h2 class="quizName">  <!-- where the quiz name goes --></h2>

        <div class="quizArea">
        <div class="quizHeader">
                <!-- where the quiz main copy goes -->
                <a class="button startQuiz" href="#">Get Started!</a>
        </div>

            <!-- where the quiz gets built -->
        </div>

        <div class="quizResults">
            <h3 class="quizScore">You Scored: <span><!-- where the quiz score goes --></span></h3>

            <h3 class="quizLevel"><strong>Ranking:</strong> <span><!-- where the quiz ranking level goes --></span></h3>

            <div class="quizResultsCopy">
                <!-- where the quiz result copy goes -->
            </div>
        </div>
	
	</div>
     </div>
       </div>
       
       
    <div class="rightImage">
    <div id="copyrightBox">
     <h3>Copyright Info</h3>
    <h3> Game info here</h3>
    </div>
    
    </div>
  
 </div><!--close gameContainer-->

<div class="clear"></div>
<!-- /footer -->
<div data-role="footer">
		<h4><a href="my_profile.html" style="text-decoration:none;">My Profile</a></h4>
	</div>
<!-- /footer -->	

<div id="footer">eduHack 2013</div>
    
</div><!-- /page -->

</div>
</body>
</html>